@charset "UTF-8";
/**
 * reset
 *
 * @author Ma Junbao <mlive@live.cn> || @github.com/majunbao
*/
a,
abbr,
address,
article,
aside,
audio,
b,
blockquote,
body,
caption,
cite,
code,
dd,
del,
dfn,
dialog,
div,
dl,
dt,
em,
fieldset,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
hr,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
p,
pre,
q,
samp,
section,
small,
span,
strong,
sub,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
ul,
var,
video {
  border: 0;
  margin: 0;
  outline: 0;
  padding: 0;
  font-size: 100%;
  font-weight: normal;
}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
  display: block;
}

audio, canvas, video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

audio:not([controls]) {
  display: none;
}

[hidden] {
  display: none;
}

html {
  width: 100%;
  height: 100%;
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  overflow-y: visible !important;
}

a {
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}

img {
  border: 0;
  -ms-interpolation-mode: bicubic;
  vertical-align: middle;
  font-size: 0;
}

ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

th, td, caption {
  vertical-align: top;
}

.icon {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  background: none;
  border: 0;
}

::-ms-clear, ::-ms-reveal {
  display: none;
  width: 0;
  height: 0;
}

body, input, textarea, keygen, select, button {
  color: #333;
  font-size: 14px;
  font-family: "PingHei","Lucida Grande", "Lucida Sans Unicode", "Helvetica","Arial","Verdana","sans-serif";
}

*:active, *:focus {
  outline: none;
}

.input, textarea, .button {
  /*去除ios webkit默认样式*/
  -webkit-appearance: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
}

.clear:after {
  content: "\20";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.clear {
  *zoom: 1;
}

.on-left {
  float: left;
}

.on-right {
  float: right !important;
}

.block {
  display: block;
}

.inline {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.none {
  display: none !important;
}

.hidden {
  overflow: hidden;
}

.visible {
  visibility: visible;
}

.vhidden {
  visibility: hidden;
}

.margin-0 {
  margin: 0px !important;
}

.margin-5 {
  margin: 5px !important;
}

.margin-10 {
  margin: 10px !important;
}

.margin-15 {
  margin: 15px !important;
}

.margin-20 {
  margin: 20px !important;
}

.margin-25 {
  margin: 25px !important;
}

.margin-30 {
  margin: 30px !important;
}

.margin-35 {
  margin: 35px !important;
}

.margin-40 {
  margin: 40px !important;
}

.margin-45 {
  margin: 45px !important;
}

.margin-50 {
  margin: 50px !important;
}

.margin-55 {
  margin: 55px !important;
}

.margin-60 {
  margin: 60px !important;
}

.margin-top-0 {
  margin-top: 0px !important;
}

.margin-top-5 {
  margin-top: 5px !important;
}

.margin-top-10 {
  margin-top: 10px !important;
}

.margin-top-15 {
  margin-top: 15px !important;
}

.margin-top-20 {
  margin-top: 20px !important;
}

.margin-top-25 {
  margin-top: 25px !important;
}

.margin-top-30 {
  margin-top: 30px !important;
}

.margin-top-35 {
  margin-top: 35px !important;
}

.margin-top-40 {
  margin-top: 40px !important;
}

.margin-top-45 {
  margin-top: 45px !important;
}

.margin-top-50 {
  margin-top: 50px !important;
}

.margin-top-55 {
  margin-top: 55px !important;
}

.margin-top-60 {
  margin-top: 60px !important;
}

.margin-right-0 {
  margin-right: 0px !important;
}

.margin-right-5 {
  margin-right: 5px !important;
}

.margin-right-10 {
  margin-right: 10px !important;
}

.margin-right-15 {
  margin-right: 15px !important;
}

.margin-right-20 {
  margin-right: 20px !important;
}

.margin-right-25 {
  margin-right: 25px !important;
}

.margin-right-30 {
  margin-right: 30px !important;
}

.margin-right-35 {
  margin-right: 35px !important;
}

.margin-right-40 {
  margin-right: 40px !important;
}

.margin-right-45 {
  margin-right: 45px !important;
}

.margin-right-50 {
  margin-right: 50px !important;
}

.margin-right-55 {
  margin-right: 55px !important;
}

.margin-right-60 {
  margin-right: 60px !important;
}

.margin-bottom-0 {
  margin-bottom: 0px !important;
}

.margin-bottom-5 {
  margin-bottom: 5px !important;
}

.margin-bottom-10 {
  margin-bottom: 10px !important;
}

.margin-bottom-15 {
  margin-bottom: 15px !important;
}

.margin-bottom-20 {
  margin-bottom: 20px !important;
}

.margin-bottom-25 {
  margin-bottom: 25px !important;
}

.margin-bottom-30 {
  margin-bottom: 30px !important;
}

.margin-bottom-35 {
  margin-bottom: 35px !important;
}

.margin-bottom-40 {
  margin-bottom: 40px !important;
}

.margin-bottom-45 {
  margin-bottom: 45px !important;
}

.margin-bottom-50 {
  margin-bottom: 50px !important;
}

.margin-bottom-55 {
  margin-bottom: 55px !important;
}

.margin-bottom-60 {
  margin-bottom: 60px !important;
}

.margin-left-0 {
  margin-left: 0px !important;
}

.margin-left-5 {
  margin-left: 5px !important;
}

.margin-left-10 {
  margin-left: 10px !important;
}

.margin-left-15 {
  margin-left: 15px !important;
}

.margin-left-20 {
  margin-left: 20px !important;
}

.margin-left-25 {
  margin-left: 25px !important;
}

.margin-left-30 {
  margin-left: 30px !important;
}

.margin-left-35 {
  margin-left: 35px !important;
}

.margin-left-40 {
  margin-left: 40px !important;
}

.margin-left-45 {
  margin-left: 45px !important;
}

.margin-left-50 {
  margin-left: 50px !important;
}

.margin-left-55 {
  margin-left: 55px !important;
}

.margin-left-60 {
  margin-left: 60px !important;
}

.padding-0 {
  padding: 0px !important;
}

.padding-5 {
  padding: 5px !important;
}

.padding-10 {
  padding: 10px !important;
}

.padding-15 {
  padding: 15px !important;
}

.padding-20 {
  padding: 20px !important;
}

.padding-25 {
  padding: 25px !important;
}

.padding-30 {
  padding: 30px !important;
}

.padding-35 {
  padding: 35px !important;
}

.padding-40 {
  padding: 40px !important;
}

.padding-45 {
  padding: 45px !important;
}

.padding-50 {
  padding: 50px !important;
}

.padding-55 {
  padding: 55px !important;
}

.padding-60 {
  padding: 60px !important;
}

.padding-top-0 {
  padding-top: 0px !important;
}

.padding-top-5 {
  padding-top: 5px !important;
}

.padding-top-10 {
  padding-top: 10px !important;
}

.padding-top-15 {
  padding-top: 15px !important;
}

.padding-top-20 {
  padding-top: 20px !important;
}

.padding-top-25 {
  padding-top: 25px !important;
}

.padding-top-30 {
  padding-top: 30px !important;
}

.padding-top-35 {
  padding-top: 35px !important;
}

.padding-top-40 {
  padding-top: 40px !important;
}

.padding-top-45 {
  padding-top: 45px !important;
}

.padding-top-50 {
  padding-top: 50px !important;
}

.padding-top-55 {
  padding-top: 55px !important;
}

.padding-top-60 {
  padding-top: 60px !important;
}

.padding-right-0 {
  padding-right: 0px !important;
}

.padding-right-5 {
  padding-right: 5px !important;
}

.padding-right-10 {
  padding-right: 10px !important;
}

.padding-right-15 {
  padding-right: 15px !important;
}

.padding-right-20 {
  padding-right: 20px !important;
}

.padding-right-25 {
  padding-right: 25px !important;
}

.padding-right-30 {
  padding-right: 30px !important;
}

.padding-right-35 {
  padding-right: 35px !important;
}

.padding-right-40 {
  padding-right: 40px !important;
}

.padding-right-45 {
  padding-right: 45px !important;
}

.padding-right-50 {
  padding-right: 50px !important;
}

.padding-right-55 {
  padding-right: 55px !important;
}

.padding-right-60 {
  padding-right: 60px !important;
}

.padding-bottom-0 {
  padding-bottom: 0px !important;
}

.padding-bottom-5 {
  padding-bottom: 5px !important;
}

.padding-bottom-10 {
  padding-bottom: 10px !important;
}

.padding-bottom-15 {
  padding-bottom: 15px !important;
}

.padding-bottom-20 {
  padding-bottom: 20px !important;
}

.padding-bottom-25 {
  padding-bottom: 25px !important;
}

.padding-bottom-30 {
  padding-bottom: 30px !important;
}

.padding-bottom-35 {
  padding-bottom: 35px !important;
}

.padding-bottom-40 {
  padding-bottom: 40px !important;
}

.padding-bottom-45 {
  padding-bottom: 45px !important;
}

.padding-bottom-50 {
  padding-bottom: 50px !important;
}

.padding-bottom-55 {
  padding-bottom: 55px !important;
}

.padding-bottom-60 {
  padding-bottom: 60px !important;
}

.padding-left-0 {
  padding-left: 0px !important;
}

.padding-left-5 {
  padding-left: 5px !important;
}

.padding-left-10 {
  padding-left: 10px !important;
}

.padding-left-15 {
  padding-left: 15px !important;
}

.padding-left-20 {
  padding-left: 20px !important;
}

.padding-left-25 {
  padding-left: 25px !important;
}

.padding-left-30 {
  padding-left: 30px !important;
}

.padding-left-35 {
  padding-left: 35px !important;
}

.padding-left-40 {
  padding-left: 40px !important;
}

.padding-left-45 {
  padding-left: 45px !important;
}

.padding-left-50 {
  padding-left: 50px !important;
}

.padding-left-55 {
  padding-left: 55px !important;
}

.padding-left-60 {
  padding-left: 60px !important;
}

.line-1 {
  border-width: 1px;
}

.line-2 {
  border-width: 2px;
}

.line-3 {
  border-width: 3px;
}

/* ======  column  ====== */
.column {
  width: 100%;
  margin: 0 auto;
}

.column:after {
  clear: both;
  content: ".";
  display: block;
  font-size: 0;
  height: 0;
  line-height: 0;
  min-height: 0;
  visibility: hidden;
  *zoom: 1;
}

.column [class*=col-] {
  margin-left: 1.2%;
  float: left;
}

.column [class*=col-]:first-child {
  margin-left: 0;
}

.column .col-2-1 {
  width: 49.33%;
}

.column .col-3-1 {
  width: 32.46333%;
}

.column .col-3-2 {
  width: 66.19667%;
}

.column .col-4-1 {
  width: 24.03%;
}

.column .col-4-2 {
  width: 49.33%;
}

.column .col-4-3 {
  width: 74.63%;
}

.column .col-5-1 {
  width: 18.97%;
}

.column .col-5-2 {
  width: 39.21%;
}

.column .col-5-3 {
  width: 59.45%;
}

.column .col-5-4 {
  width: 79.69%;
}

.column .col-6-1 {
  width: 15.59667%;
}

.column .col-6-2 {
  width: 32.46333%;
}

.column .col-6-3 {
  width: 49.33%;
}

.column .col-6-4 {
  width: 66.19667%;
}

.column .col-6-5 {
  width: 83.06333%;
}

.text-bold {
  font-weight: bold !important;
}

.text-italic {
  font-style: italic !important;
}

.text-underline {
  text-decoration: underline !important;
}

.text-line-through {
  text-decoration: line-through !important;
}

.align-left {
  text-align: left !important;
}

.align-right {
  text-align: right !important;
}

.align-center {
  text-align: center !important;
}

.align-justify {
  text-align: justify;
  text-align-last: justify;
}

.align-moddle, .align-middle {
  vertical-align: middle !important;
}

.align-top {
  vertical-align: top;
}

.align-sub {
  vertical-align: sub;
}

.align-text-top {
  vertical-align: text-top;
}

.text-tiny {
  font-size: 10px !important;
}

.text-small {
  font-size: 12px !important;
}

.text-default {
  font-size: 14px !important;
}

.text-large {
  font-size: 16px !important;
}

.text-larger {
  font-size: 18px !important;
}

.text-opacity {
  opacity: 0.5;
}

.text {
  color: #7F7F7F !important;
}

.text-light {
  color: #9C9C9C !important;
}

.text-dark {
  color: #333333 !important;
}

a.text:hover,
a.text-light:hover,
a.text-dark:hover {
  color: #5ecbf2 !important;
}

a {
  /*color: #5ecbf2;*/
}

a:hover {
  text-decoration: none;
  cursor: pointer;
  /*color: #5ecbf2;*/
}

a:focus {
  outline: none;
}

/*
* Option Button
*/
/*
* Button Namespace
* 
* 默认是 .button ，根据喜好也可设置为 .btn
*/
/*
* Button Defaults
*
* 根据其他项目改变这些设置。
* 按钮的宽度没有直接用 width 属性设置，而是采用 min-width + padding 的方式，
* 这样按钮有了最小宽度，文字过多时宽度也会自动扩展。
*
* 按钮的高度 采用 height 和 line-height 的方式控制。
* 
*/
/*
* Button Colors
*
* (name, background, color)
* 
*/
/*
* Button Shapes
*
*/
/*
* Button Sizes
*
* (name width height padding font-size)
* 
* smallest smaller small default large larger largest
*/
/*尺寸*/
/*
* Base Botton Style
*
* The default values for the .botton class
*/
.button {
  display: inline-block;
  cursor: pointer;
  border: none;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  font-size: 14px;
  /*button colors*/
  color: #333333;
  background: transparent;
  /*button shapes*/
  min-width: 128px;
  padding: 0 10px;
  height: 38px;
  line-height: 38px;
  border-radius: 3px;
  border-width: 1px;
  border-style: solid;
  border-color: #D9D9D9;
  transition-property: background-color, color, border-color;
  transition-duration: 0.3s;
  -webkit-user-select: none;
  box-sizing: content-box;
}

.button:hover {
  background: #e1e1e1;
}

.button:active {
  background: transparent;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
}

.button object {
  width: 100% !important;
  height: 100% !important;
}

/**
* Disabled State
*
*/
.button-disabled,
.button-disabled:hover {
  background: #dde2ef !important;
  border-color: #dde2ef !important;
  color: #fff !important;
  cursor: not-allowed;
}

/**
* Button color
*
*/
.button-blue {
  background-color: #439BF5;
  border-color: #439BF5;
  color: #FFF;
}

.button-blue:hover {
  background-color: #73b5f8;
  color: #FFF;
}

.button-blue:active {
  background-color: #4d9beb;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
}

.button-green {
  background-color: #34c276;
  border-color: #34c276;
  color: #FFF;
}

.button-green:hover {
  background-color: #57d290;
  color: #FFF;
}

.button-green:active {
  background-color: #40b677;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
}

.button-orange {
  background-color: #f9b954;
  border-color: #f9b954;
  color: #FFF;
}

.button-orange:hover {
  background-color: #fbcd85;
  color: #FFF;
}

.button-orange:active {
  background-color: #f0b75d;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
}

.button-while {
  background-color: #FFF;
  border-color: #FFF;
  color: black;
}

.button-while:hover {
  background-color: white;
  color: black;
}

.button-while:active {
  background-color: white;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
}

.button-grey {
  background-color: #bababa;
  border-color: #bababa;
  color: #FFF;
}

.button-grey:hover {
  background-color: #d4d4d4;
  color: #FFF;
}

.button-grey:active {
  background-color: #bababa;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
}

/**
* Button size
*
*/
.button-smaller {
  min-width: 18px;
  padding: 0 4px;
  height: 18px;
  line-height: 18px;
  font-size: 14px;
}

.button-small {
  min-width: 53px;
  padding: 0 5px;
  height: 30px;
  line-height: 30px;
  font-size: 12px;
}

.button-thin {
  min-width: 52px;
  padding: 0 35px;
  height: 34px;
  line-height: 34px;
  font-size: 14px;
}

.button-large {
  min-width: 158px;
  padding: 0 10px;
  height: 44px;
  line-height: 44px;
  font-size: 16px;
}

.button-larger {
  min-width: 290px;
  padding: 0 14px;
  height: 44px;
  line-height: 44px;
  font-size: 20px;
}

.button-border {
  background: none;
}

.button-border:hover {
  background: #eee;
  color: #333333;
}

.button-border:active {
  background: #ddd;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
  border-color: transparent;
}

.button-border.button-blue {
  border-color: #439BF5;
  color: #439BF5;
}

.button-border.button-blue:hover {
  background: #4d9beb;
  color: #FFF;
}

.button-border.button-blue:active {
  background: #4d9beb;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
  border-color: #0d7cee;
}

.button-border.button-green {
  border-color: #34c276;
  color: #34c276;
}

.button-border.button-green:hover {
  background: #40b677;
  color: #FFF;
}

.button-border.button-green:active {
  background: #40b677;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
  border-color: #279259;
}

.button-border.button-orange {
  border-color: #f9b954;
  color: #f9b954;
}

.button-border.button-orange:hover {
  background: #f0b75d;
  color: #FFF;
}

.button-border.button-orange:active {
  background: #f0b75d;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
  border-color: #f7a119;
}

.button-border.button-while {
  border-color: #FFF;
  color: #FFF;
}

.button-border.button-while:hover {
  background: white;
  color: black;
}

.button-border.button-while:active {
  background: white;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
  border-color: #e0e0e0;
}

.button-border.button-grey {
  border-color: #bababa;
  color: #bababa;
}

.button-border.button-grey:hover {
  background: #bababa;
  color: #FFF;
}

.button-border.button-grey:active {
  background: #bababa;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
  border-color: #9b9b9b;
}

.button-radius {
  border-radius: 200px;
}

/*
* Option Input
*/
/*
* Input Namespace
* 
* 默认是 input ，根据喜好也可设置为 .input or input[type=text]
*/
/*
* Input Defaults
*
* 根据其他项目改变这些设置。
*
* 
*/
/*
* Input Colors
*
* (name, border-color, color)
* 
*/
/*
* Input Sizes
*
* (name width height padding font-size)
* smallest smaller small default large larger largest
*/
/*尺寸*/
.input {
  margin: 0;
  outline: none;
  vertical-align: middle;
  padding: 0 10px;
  width: 278px;
  line-height: 1;
  height: 38px;
  border-style: solid;
  border-width: 1px;
  border-color: #D0D0D0;
  color: #7F7F7F;
  border-radius: 3px;
}

.input:hover {
  border-color: #73b5f8;
}

.input:active,
.input:focus {
  border-color: #439BF5;
}

/**
* Disabled State
*
*/
.input-disabled,
.input-disabled:hover {
  background: #dde2ef !important;
  border-color: #dde2ef !important;
  color: #fff !important;
  cursor: not-allowed;
}

/**
* Input colors
*
*/
.input-blue {
  border-color: #439BF5;
  color: #439BF5;
}

.input-blue:hover {
  border-color: #73b5f8;
  color: #439BF5;
}

.input-blue:active, .input-blue:focus {
  border-color: #4d9beb;
}

.input-green {
  border-color: #34c276;
  color: #34c276;
}

.input-green:hover {
  border-color: #57d290;
  color: #34c276;
}

.input-green:active, .input-green:focus {
  border-color: #40b677;
}

.input-orange {
  border-color: #f9b954;
  color: #f9b954;
}

.input-orange:hover {
  border-color: #fbcd85;
  color: #f9b954;
}

.input-orange:active, .input-orange:focus {
  border-color: #f0b75d;
}

.input-grey {
  border-color: #bababa;
  color: #bababa;
}

.input-grey:hover {
  border-color: #d4d4d4;
  color: #bababa;
}

.input-grey:active, .input-grey:focus {
  border-color: #bababa;
}

/**
* Input sizes
*
*/
.input-smaller {
  width: 18px;
  padding: 0 4px;
  height: 18px;
  line-height: 18px;
  font-size: 14px;
}

.input-small {
  width: 68px;
  padding: 0 8px;
  height: 22px;
  line-height: 22px;
  font-size: 12px;
}

.input-large {
  width: 290px;
  padding: 0 14px;
  height: 44px;
  line-height: 44px;
  font-size: 16px;
}

.input-larger {
  width: 470px;
  padding: 0 14px;
  height: 44px;
  line-height: 44px;
  font-size: 16px;
}

.input-radius {
  border-radius: 200px;
}

/*
 * select plugin
 *
 */
.select {
  position: relative;
  border: 1px solid #DBDBDB;
  min-width: 80px;
  *width: 80px;
  padding: 0 30px 0 0;
  height: 38px;
  border-radius: 38px;
  line-height: 38px;
  display: inline-block;
  *zoom: 1;
  *display: inline;
  vertical-align: middle;
  color: #fff;
  cursor: pointer;
  overflow: hidden;
}

.select .btn-select {
  display: block;
  padding-left: 14px;
}

.select select {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  padding: 0;
  opacity: 0.001;
  filter: alpha(opacity=0.1);
  z-index: 2;
  border: none;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.select select:hover {
  cursor: pointer;
}

.select i {
  position: absolute;
  right: 9px;
  top: 50%;
  margin-top: -3px;
  z-index: 1;
  display: block;
  width: 10px;
  height: 7px;
  background: url(../images/ui.png) no-repeat 0 -43px;
}

.select:hover {
  border-color: #87ddfc;
  cursor: pointer;
}

.select:active,
.select:focus {
  border-color: #55cffb;
}

.select-disabled {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.select-disabled select:hover {
  cursor: not-allowed;
}

.select-disabled i {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.select-larger {
  width: 188px;
  height: 46px;
  line-height: 46px;
  font-size: 16px;
}

.select-larger select {
  font-size: 16px;
}

.select-small {
  height: 30px;
  line-height: 30px;
  font-size: 12px;
}

.select-small select {
  font-size: 16px;
}

.table {
  width: 100%;
  color: #576077;
  font-size: 14px;
}

.table {
  border: 0px solid #f4f5f9;
  text-align: center;
}

.table th {
  padding: 14px 15px;
}

.table td {
  padding: 14px 15px;
}

.table th {
  color: #FFFFFF;
  background-color: #B5BFC7;
}

.table td {
  border: 0px solid #f4f5f9;
}

.table tbody tr {
  border-bottom: 1px solid #ddd;
}

.table.dark {
  border-width: 0;
}

.table.dark th {
  background-color: #3f3f4d;
  color: #c0c7da;
}

.table.dark td {
  border-width: 0;
}

.table.dark tbody tr:nth-child(even) {
  background-color: #f4f5f9;
}

.table.noborder th, .table.noborder td {
  border: 0;
}

/*兼容*/
.ie .table.dark {
  background-color: transparent;
}

.ie .table.dark td {
  border: 0px solid #f4f5f9;
}

/*
* Tab Config
*/
.tab {
  position: relative;
}

.tab ul.tab-header {
  height: 38px;
}

.tab ul.tab-header li {
  float: left;
  height: 100%;
}

.tab ul.tab-header li a {
  display: inline-block;
  background-color: #439BF5;
  text-align: center;
  padding: 0 10px;
  min-width: 80px;
  text-decoration: none;
  color: #fff;
  height: 100%;
  line-height: 38px;
  border-left: 1px solid #579be1;
}

.tab ul.tab-header li.now a {
  color: #000;
  font-weight: bold;
  background-color: #f4f5f9;
}

.tab div.tab-content {
  display: none;
}

.tab div.tab-content.now {
  display: block;
  padding: 15px 10px;
  background-color: #f4f5f9;
}

/*兼容*/
.ie6 .tab div.now,
.ie7 .tab div.now {
  /*这个不用display:block;是为了兼容IE67浏览器*/
  display: inline-block;
}

.ie6 .tab ul.tab-header li a {
  width: expression(this.scrollWidth>100?'auto':'79px');
}

.label {
  display: inline-block;
  font-size: 12px;
  color: #fff;
  background-color: #439BF5;
  padding: 5px 10px;
  border-radius: 5px;
}

/*
*
* Lable Colors
*
* (name background)
*/
.label-blue {
  background: #439BF5;
}

.label-green {
  background: #34c276;
}

.label-orange {
  background: #f9b954;
}

.label-grey {
  background: #bababa;
}

.label-group .label {
  margin-right: 5px;
}

.label-group .label:last-child {
  margin-right: 0;
}

tip {
  display: block;
  position: absolute;
  z-index: 1000;
  max-width: 220px;
}

tip .tip-inner {
  background-color: #464646;
  color: #ededed;
  padding: 8px 22px;
  border-radius: 6px;
  line-height: 1.5;
}

tip .tip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  line-height: 0;
  border: 5px dashed #464646;
}

tip.tip-top .tip-arrow, tip.tip-bottom .tip-arrow {
  left: 50%;
  margin-left: -5px;
  border-right-color: transparent;
  border-left-color: transparent;
}

tip.tip-left .tip-arrow, tip.tip-right .tip-arrow {
  top: 50%;
  margin-top: -5px;
  border-top-color: transparent;
  border-bottom-color: transparent;
}

tip.tip-left .tip-arrow {
  right: 0;
  border-right: none;
  border-left-style: solid;
  /*IE678*/
}

tip.tip-right .tip-arrow {
  left: 0;
  border-left: none;
  border-right-style: solid;
  /*IE678*/
}

tip.tip-top .tip-arrow {
  bottom: 0;
  border-bottom: none;
  border-top-style: solid;
  /*IE678*/
}

tip.tip-bottom .tip-arrow {
  top: 0;
  border-top: none;
  border-bottom-style: solid;
  /*IE678*/
}

.tip-top {
  padding-bottom: 5px;
}

.tip-right {
  padding-left: 5px;
}

.tip-bottom {
  padding-top: 5px;
}

.tip-left {
  padding-right: 5px;
}

tip.small .tip-inner {
  font-size: 12px;
  padding: 5px 15px;
}

/*兼容*/
.ie6 .tip-top {
  padding-bottom: 5px;
}

.ie6 .tip-right {
  padding-left: 5px;
}

.ie6 .tip-bottom {
  padding-top: 5px;
}

.ie6 .tip-left {
  padding-right: 5px;
}

.ie6 tip {
  width: expression(this.scrollWidth > 220 ? "222px" : "auto");
}

tip.small {
  width: auto !important;
}

/*
* Config
* 
*/
/*
*
* Mixin
*/
/*
*
* Base
*/
.notice {
  padding: 20px;
  color: #fff;
  background-color: #439BF5;
}

.notice h1 {
  font-size: 16px;
  font-weight: bolder;
  margin: 0 0 10px 0;
}

.notice-bule {
  background: #439BF5;
}

.notice-green {
  background: #34c276;
}

.notice-orange {
  background: #f9b954;
}

.notice-grey {
  background: #bababa;
}

.page {
  font-size: 0;
  -webkit-user-select: none;
  height: 36px;
  line-height: 36px;
}

.page a {
  border: 1px solid #DEE1E6;
  color: #575E79;
  padding: 0 16px;
  text-align: center;
  text-decoration: none;
  margin-right: -1px;
  font-size: 16px;
  display: inline-block;
  vertical-align: middle;
  /*ie678 解决汉子和数字上下不对齐*/
}

.page a:first-child {
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}

.page a:last-child {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}

.page a.now, .page a:hover {
  background-color: #DEE1E6;
}

.page a.disabled {
  color: #999999;
}

.page.page-right {
  text-align: right;
}

.page.page-right a {
  margin-right: 0;
  margin-left: -1px;
}

.page .icon {
  margin: -4px 0 0 0;
}

.pages .page {
  display: inline;
}

/*兼容*/
.ie6 .page a.disabled {
  background-color: transparent !important;
  color: #999;
}

.progress {
  height: 31px;
  line-height: 31px;
  border: 4px solid var(--grey-light);
  background-color: var(--grey-light);
}

.progress-bar {
  background-color: var(--theme);
  background-image: repeating-linear-gradient(-45deg, var(--theme), var(--theme) 10px, var(--theme-hover) 10px, var(--theme-hover) 20px);
  color: var(--grey-light);
  text-align: center;
  animation: barAnimation 12s linear infinite;
}

.progress.success .progress-bar {
  background-color: var(--success);
  background-image: repeating-linear-gradient(-45deg, var(--success), var(--success) 10px, var(--success-hover) 10px, var(--success-hover) 20px);
}

@keyframes barAnimation {
  from {
    background-position: 0% 0%;
  }
  to {
    background-position: 600px 0%;
  }
}

.progress-small {
  height: 14px;
  line-height: 14px;
}

.progress.radius {
  border-radius: 20px;
  overflow: hidden;
}

.form fieldset {
  border: none;
}

.form fieldset .f-label {
  display: inline-block;
  *zoom: 1;
  *display: inline;
  width: 112px;
}

.form fieldset label.long {
  width: 300px;
}

.form label.input-orange {
  margin-left: 10px;
}

.form-m20 fieldset {
  padding-bottom: 20px;
}

/*
* Config
*/
/*
* Mixin
*/
/*
* Base
*/
.textarea {
  margin: 0;
  border: 0;
  outline: none;
  overflow: auto;
  border: 1px solid #E1E1E1;
  padding: 10px;
  width: 468px;
  min-height: 103px;
}

.textarea:hover {
  border-color: #73b5f8;
}

.textarea:focus,
.textarea:active {
  border-color: #439BF5;
}

.textarea[disabled],
.textarea-disabled {
  background-color: #dde2ef;
  border: 1px solid #dde2ef;
  color: #fff;
}

.textarea[disabled]:hover,
.textarea[disabled]:focus .textarea-disabled:hover,
.textarea-disabled:focus {
  cursor: not-allowed;
}

/*兼容*/
.ie6 textarea {
  height: 88px;
  background-color: transparent;
}

.banner {
  height: 480px;
  width: 100%;
  overflow: hidden;
  position: relative;
}

.banner-item {
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 0;
  visibility: hidden;
}

.banner-item.now {
  z-index: 1;
  visibility: visible;
}

.banner-item-img {
  height: 480px;
  width: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: auto 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.banner-item.now .banner-item-img {
  opacity: 1;
  visibility: visible;
}

.banner-item-text {
  position: relative;
  z-index: 1;
  width: 1280px;
  margin: 0 auto;
  margin-top: 100px;
}

.banner-item-text-inner {
  overflow: hidden;
  white-space: nowrap;
}

.banner-item-text span {
  font-size: 16px;
  color: #FFF;
  background-color: #FFBE34;
  padding: 7px;
  display: inline-block;
}

.banner-item-text h2 {
  font-size: 75px;
  color: #323232;
  padding-top: 20px;
  line-height: 100%;
}

.banner-item-text h3 {
  font-size: 16px;
  color: #6B6B6B;
  padding-top: 14px;
}

.banner-item-text .button {
  margin-top: 75px;
}

.banner .ctrl {
  text-align: center;
  position: absolute;
  bottom: 10px;
  width: 100%;
  z-index: 1;
  font-size: 0;
}

.banner .ctrl .ctrl-i {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  width: 30px;
  height: 10px;
  margin: 0 3px;
  background-color: #E6E6E6;
}

.banner .ctrl .ctrl-i.now {
  background-color: #41C5F3;
}

.banner .navs-prev,
.banner .navs-next {
  visibility: hidden;
  opacity: 0;
  transition: all .5s .5s;
}

.banner:hover .navs-prev,
.banner:hover .navs-next {
  transition: all .5s;
  visibility: visible;
  opacity: 1;
}

.banner .navs .navs-prev,
.banner .navs .navs-next {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 50%;
  width: 28px;
  height: 56px;
  width: 12px;
  height: 20px;
  border-width: 18px 8px;
  border-style: solid;
  border-color: #41C5F3;
  margin-top: -28px;
  background: #41C5F3 url(../images/sprites.png) no-repeat -430px 0;
}

.banner .navs .navs-next {
  right: 0;
  left: auto;
  background-position: -430px -40px;
}

.banner-small {
  width: 640px;
  height: 468px;
  box-shadow: 0 20px 44px 0 #eee;
  transition: box-shadow 0.3s;
}

.banner-small:hover {
  box-shadow: 0 30px 60px 0 #eee;
}

.ie .banner-small {
  border: 1px solid #E3E3E3;
}

.banner-small .banner-item-img {
  height: 350px;
}

.banner-small .banner-item-text {
  width: 100%;
  position: absolute;
  bottom: 30px;
  left: 25px;
}

.banner-small .banner-item.now .banner-item-text {
  opacity: 1;
  visibility: visible;
}

.banner-small .banner-item-text h2 {
  font-size: 20px;
}

.banner-small .banner-item-text h3 {
  font-size: 14px;
}

.banner.banner-small .ctrl {
  width: auto;
  right: 25px;
  bottom: 70px;
}

.banner.banner-small .ctrl .ctrl-i {
  width: 10px;
  height: 10px;
}

.banner-small .navs {
  display: block;
}

.banner-small .navs .navs-prev,
.banner-small .navs .navs-next {
  width: 23px;
  height: 40px;
  margin-top: -60px;
  background: url(../images/sprites.png) no-repeat -467px 0px;
  left: 15px;
}

.banner-small .navs .navs-next {
  background-position: -496px 0px;
  left: auto;
  right: 15px;
}

/*
* .Checkbox
*/
.checkbox:hover,
.radio:hover {
  cursor: pointer;
}

.checkbox input,
.radio input {
  position: fixed;
  left: -9999px;
}

.checkbox span,
.radio span {
  vertical-align: middle;
}

.checkbox input + i,
.radio input + i {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url(../images/ui.png) no-repeat 0 0;
  margin-right: 3px;
  position: relative;
  top: 1px;
  vertical-align: middle;
}

.checkbox input:checked + i {
  background-position: -20px 0;
}

.checkbox-large input + i,
.radio-large input + i {
  width: 20px;
  height: 20px;
  margin-right: 10px;
}

.checkbox-small input + i,
.radio-small input + i {
  width: 16px;
  height: 16px;
  margin-right: 4px;
}

.radio-small input + i {
  background-position: -32px -24px;
}

.radio-small input:checked + i {
  background-position: -48px -24px;
}

/*
* 优雅降级 ie6-8
*/
.ie .checkbox input,
.ie .radio input {
  position: static;
  vertical-align: middle;
}

.ie .checkbox i,
.ie .radio i {
  display: none;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.absolute-top {
  top: 0;
}

.absolute-right {
  right: 0;
}

.absolute-bottom {
  bottom: 0;
}

.absolute-left {
  left: 0;
}

/*修复 placeholder*/
.support-place-holder {
  position: relative;
}

.support-place-holder-text {
  position: absolute;
  left: 0;
  text-align: left;
  font-weight: normal;
  text-decoration: none;
  font-style: normal;
  color: #969696;
  z-index: 1;
  border: none;
}

h1.logo {
  width: 1000px;
  margin: 60px auto;
  font-size: 140px;
  text-transform: capitalize;
  font-variant: small-caps;
  color: #439BF5;
}

h1.logo small {
  font-size: 20px;
  color: #bababa;
  font-family: sans-serif;
}

section {
  font-family: verdana, "microsoft yahei";
  width: 1000px;
  margin: 0 auto 50px auto;
  overflow: hidden;
}

section h2.demo-h2 {
  font-size: 30px;
  color: #666;
  margin-bottom: 30px;
  padding-top: 20px;
  font-weight: normal;
  text-transform: capitalize;
  font-variant: small-caps;
}

section article {
  margin-bottom: 15px;
}

/*demo*/
.module {
  margin: 0 auto;
  width: 80%;
  text-align: center;
}

.column p.col-num {
  text-align: center;
  background-color: #bababa;
  height: 45px;
  line-height: 45px;
  margin: 10px 0;
  color: #7F7F7F;
  float: none;
}

.column:hover p.col-num {
  background-color: #bababa;
}

/*Theme Color*/
.demo-color {
  overflow: hidden;
}

.demo-color li {
  float: left;
  width: 22%;
}

.demo-color li .color {
  margin-bottom: 15px;
}

.color {
  display: block;
  width: 50px;
  height: 50px;
  border-radius: 20%;
  padding: 0;
  background-color: #439BF5;
}

.color-light {
  background-color: #73b5f8;
}

.color-dark {
  background-color: #4d9beb;
}

.color.blue {
  background-color: #439BF5;
}

.color.blue-light {
  background-color: #73b5f8;
}

.color.blue-dark {
  background-color: #4d9beb;
}

.color.green {
  background-color: #34c276;
}

.color.green-light {
  background-color: #57d290;
}

.color.green-dark {
  background-color: #40b677;
}

.color.orange {
  background-color: #f9b954;
}

.color.orange-light {
  background-color: #fbcd85;
}

.color.orange-dark {
  background-color: #f0b75d;
}

.color.grey {
  background-color: #bababa;
}

.color.grey-light {
  background-color: #d4d4d4;
}

.color.grey-dark {
  background-color: #bababa;
}

.color.text {
  background-color: #7F7F7F;
}

.color.text-light {
  background-color: #999999;
}

.color.text-dark {
  background-color: #7f7f7f;
}

.demo-tip {
  position: relative;
  width: 1000px;
  height: 50px;
}

.demo-tip .tip-top {
  margin-left: 0%;
}

.demo-tip .tip-right {
  margin-left: 20%;
}

.demo-tip .tip-bottom {
  margin-left: 40%;
}

.demo-tip .tip-left {
  margin-left: 60%;
}

.demo-calendar {
  position: relative;
  height: 300px;
}
